<!-- 支付结果页面 -->
<template>
    <view>
        <view class="pay-order-result">
        <view class="pay-order-result-img">
            <img :src="state.orderPayResut[state.orderIndex].icon" alt="" />
        </view>
        <view class="pay-order-result-text">{{ state.orderPayResut[state.orderIndex].name }}</view>
        <view class="pay-order-price-result-text">{{ state.orderPayResut[state.orderIndex].value }}</view>
    </view>
    <van-button type="primary" v-if="state.orderIndex == 2" class="top-up-confirm top-up-confirm-is-success" @click="orderResultFn()">{{
        state.orderPayResut[state.orderIndex].btnValue }}</van-button>

    <view class="top-up-confirm-result" v-else>
        <van-button type="primary" class="top-up-confirm" @click="orderResultFn()">{{ state.orderPayResut[state.orderIndex].btnValue
        }}</van-button>
        <view class="top-up-confirm-text">取消支付</view>
    </view>
    </view>
</template>
    
<script setup>
import { reactive, getCurrentInstance, onMounted } from "vue"
import { getAuthorization, setAuthorization } from "@/utils/auth.js"

import o1 from "@/assets/image/icon109.png"
import o2 from "@/assets/image/icon120.png"
import o3 from "@/assets/image/icon121.png"


import { onLoad } from '@dcloudio/uni-app'
const state = reactive({
    show: false,
    curIndex: false,
    orderPayResut: {
        1: {
            id: 1,
            name: '支付成功',
            value: '实付金额￥',
            btnValue: '完成',
            icon:o1,
        },
        2: {
            id: 2,
            name: '支付失败',
            value: '实付金额￥',
            btnValue: '重新支付',
            icon:o2,
        },
        3: {
            id: 3,
            name: '请问支付是否成功',
            value: '实付金额￥',
            btnValue: '已完成支付',
            icon:o3,
        },
    },
    orderData:{},
    orderIndex:3
})

onLoad((options) => {
    state.orderData = options
    // state.orderIndex = options.orderIndex ? options.orderIndex : 3
    for( let item in state.orderPayResut){
        state.orderPayResut[item].value = state.orderPayResut[item].value + options.price
    }
    document.getElementById('payMent').innerHTML = "";
})



</script>
    
<style lang="scss" scoped>
.pay-order-result-img {
    padding-top: 200rpx;
    width: 200rpx;
    margin: 0 auto;

    img {
        width: 100%;
        margin-left: 20rpx;
        display: block;
    }
}

.pay-order-result-text {
    font-size: 40rpx;
    font-weight: bold;
    color: #262626;
    margin: 36rpx auto 28rpx auto;
    text-align: center;
}

.pay-order-price-result-text {
    text-align: center;
    color: #999
}

.top-up-confirm {
    width: calc(100% - 60rpx);
    margin-left: 30rpx;
    margin-top: 100rpx;
    font-size: 36rpx;
    line-height: 100rpx;
    height: 100rpx;
    background: #262626;
}

.top-up-confirm-text {
    color: #666;
    text-align: center;
    margin-top: 20rpx;
    font-size: 30rpx;
}

.top-up-confirm-is-success {
    width: calc(100% - 60rpx);
    position: fixed;
    bottom: 30rpx;
}
</style>
    